<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    
</body>
<script>
    //加载图片
   function loadImg(src) {
       return new Promise(function (resolve,reject) {
        //    创建img标签
           let img = document.createElement("img");
           img.src = src;
           img.onload=function(){
            resolve(img)
           }
           img.error=function(){
            reject(img)
           }
       })
   }
    //在页面中显示出来
    function showImg(imgs) {
       let p = document.createElement("p")
       p.appendChild(imgs)
       document.body.appendChild(p)
       
    }

    Promise.race([//    Promise.race  谁先来渲染谁   
        loadImg("https://img10.360buyimg.com/n4/s260x260_jfs/t3079/363/6070979658/42126/5b5c2f39/589af086N4a3bed39.jpg"),  
        loadImg("https://img14.360buyimg.com/n4/s260x260_jfs/t4345/284/2534342556/119746/550dee37/58d34a9dNf0bd717f.jpg"),
        loadImg("https://img13.360buyimg.com/n4/s260x260_jfs/t3259/170/5587914266/144572/64259fc5/5873347aN14e34822.jpg"),
    ]).then(showImg)

</script>
</html>